<!DOCTYPE HTML>
<html>
<head>
    <title>json预览</title>

    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">

    <link href="jsoneditor/jsoneditor.css" rel="stylesheet" type="text/css">
    <link href="jsoneditor/darktheme.css" rel="stylesheet" type="text/css">
    <script src="jsoneditor/jsoneditor.js"></script>
    <script src="js/jquery-3.3.1.min.js"></script>

    <style type="text/css">
        #jsoneditor {
            width: 100%;
            height: 600px;
        }
    </style>
    <link rel="icon" type="image/x-icon" href="search.ico">
</head>
<body>

<div id="jsoneditor"></div>
<script>
    var container = document.getElementById('jsoneditor');
    var options = {
        mode: 'code',
        modes: ['view', 'code','tree'],
        indentation: 4,
        onError: function (err) {
            alert(err.toString());
        }/*,
        onEditable: function (node) {
            if (!node.path) {
                // In modes code and text, node is empty: no path, field, or value
                // returning false makes the text area read-only
                return false;
            }
        }*/
    };
    var editor = new JSONEditor(container, options, null);
    var url = '[[${fileUrl}]]';
    $.ajax({
        url: url,
        type: 'get',
        data: {},
        cache: false,
        success: function (res) {
            editor.updateText (res);
        },
        error: function (res) {
        }
    });
</script>
</body>
</html>